<template>
    <el-popover
            placement="bottom"
            width="666"
            trigger="click"
            v-model="visible"
            @show="onopen"
    >
        <div>
            <tableList ref="tableList"
                       @success="(selectRow)=>_success(selectRow)"
            ></tableList>
            <div>
                <el-button @click="()=>visible=false" size="mini">取消</el-button>
                <el-button @click="()=>_success()" size="mini" type="primary">确定</el-button>
            </div>
        </div>
        <el-input v-model="valueText"
                  slot="reference"
                  placeholder="选择表格"
                  :style="$el&&$el.style&&$el.style.cssText||'width:120px;'"
        ></el-input>
    </el-popover>
</template>
<script>
  export default {
    data() {
      return {
        valueData: '',
        valueText: '',
        visible: false,
      };
    },
    props: {
      text: { type: [String, Number] },
      value: { type: [String, Number] },
    },
    watch: {
      '$props.text'(value) {
        this.textData = value;
      },
      '$props.value'(value) {
        this.valueData = value;
      },
    },
    components: {
      tableList: () => import('./list.vue'),
    },
    methods: {
      onopen() {
        this.$refs['tableList'].initByDialog({});
      },
      _success(selectRow) {
        this.$emit('change', selectRow)
        this.$emit('update:text',selectRow&&selectRow.tableName)
        this.$emit('input',selectRow&&selectRow.id)
        this.valueText=selectRow&&selectRow.tableName
        this.visible = false;
      },
    },
  };
</script>
